<!DOCTYPE html>
<html>

<head>
    <style>
        .div-border {
            border: 1px solid red;
        }
    </style>

</head>

<body>
    <div id="mainscreen">

    </div>
</body>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
<script type="text/javascript">

    let vmInst = new Vue({
        el: "#mainscreen",
        data: {
            message: "hello world",
            labels: ["H101", "H201", "H301"]
        },
        methods: {
            hood: function () {
                alert(this.message);
            }
        },
        // 可以使用template来绑定
        template: `
            <div>
                <input type="text" v-model:value="message"/>
                <button @click="hood">显示当前值</button>
                <div class="div-border">{{message}}</div>
            </div>
        `
    });

</script>

</html>